<template>
    <view>
        <h1>TODO</h1>
        <add @add-item="addItem"></add>
        <scroll-view scroll-y>
            <view v-for="(item, index) in list" :key="index">
                <h4>{{ item.content }}</h4>
                <u-switch v-model="item.status"></u-switch>
                <u-line margin="0.5em 0" />
            </view>
        </scroll-view>
        <!-- <u-list-item v-for="item in list" :key="item.content">{{ item.content }}</u-list-item> -->

    </view>
</template>

<script>
import { Component, Vue } from 'vue-property-decorator';
import add from "./add";

@Component({
    components: {
        add
    }
})
export default class TODO extends Vue {
    list = [];

    addItem(content) {
        this.list.push({ content, status: false })
    }



}
</script>

<style  scoped></style>